import { Vector3 } from "@/utils/Vector3"
import { BaseSvg } from "@/js/components/BaseSvg"

export class Path extends BaseSvg{
    pointArray:Vector3[] = [];
    static M = 0;
    static L = 1;
    static C = 2;
    static C_ = 3;

    strokeWidth_ = 3;

    constructor(){
        super();
        this.setTag("path");
    }

    set(pointArray:number[]){
        this.pointArray.length = 0;
        for (let i = 0; i < pointArray.length; i+=3) {
            this.pointArray.push(
                new Vector3(
                    pointArray[i],
                    pointArray[i+1],
                    pointArray[i+2]
                )
            )
        }

        this.updatePoint();
        return this;
    }

    push(pointArray:number[]){
        for (let i = 0; i < pointArray.length; i+=3) {
            this.pointArray.push(
                new Vector3(
                    pointArray[i],
                    pointArray[i+1],
                    pointArray[i+2]
                )
            )
        }
        this.updatePoint();
        return this;
    }

    splice(start:number,deleteCount:number,...arg:Vector3[]){
        this.pointArray.splice(start,deleteCount,...arg);
        this.updatePoint();
        return this;
    }

    clear(): this {
        this.pointArray.length = 0;
        return this;
    }

    updatePoint(): this{
        this.setAttribute("d",this.toString());
        return this;
    }

    toString(): string {
        let str = "";
        const command = ["M","L","C",","];

        this.pointArray.forEach(point=>{
            str += `${command[point.z]} ${point.x} ${point.y} `;
        })
        
        return str;
    }

    fill(color:string){
        this.setAttribute("fill",color);
        return this;
    }

    stroke(color:string){
        this.setAttribute("stroke",color)
        return this;
    }

    strokeWidth(num:number){
        this.strokeWidth_ = num;
        this.setAttribute("stroke-width",num)
        return this;
    }
}